<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" placeholder="请输入搜索的内容" id="debounce" autofocus/>
    <script>
        window.onload=function(){
            const input=document.getElementById('debounce');
            t=500;
            let t1= new Date();//1970 至今 毫秒数 new Date() 返回日期对象 ‘+’ 类型转换 自动转变成整数类型
            // const ajax=(event)=>{
                
            //     let keyword=event.target.value;
                
            //     console.log(keyword);
            //     let t2=+new Date();
            //     if (t2-t1>t){
            //         console.log('-----')
            //         t1=t2;
            //     }
                
            // }
            //回调函数
            // 1.keyup 在一开始就声明 放到事件池里 event loop
            // 2.事件处理函数是在事件发生时触发的并执行
            // 3.异步 回到event池找出事件处理函数调用并执行
            // 单位时间里如何减少执行次数

            //debounceAjax是debounce函数的执行结果
            //debounce结果是一个函数
            const ajax=(event)=>{
                console.log('搜索',event.target.value);
            }
            const debounce=(cb,t)=>{
                return cb;
            }
            const debounceAjax=debounce(ajax,t);
            input.addEventListener('keyup',debounceAjax)
        }
    </script>
</body>
</html>